<template>
  <a-config-provider :locale="locale">
    <a-card :bordered="false">
      <a-form :form="form">
        <!--打印设置-->
        <a-popover trigger="click" placement="rightBottom">
          <template slot="content">
            <a-divider orientation="left" style="width: 720px">1、自定义内容项</a-divider>
            <a-checkbox-group @change="onDetailSettingsChange" v-model="settingDetail" :defaultValue="settingDetail">
              <a-row style="width: 720px">
                <template v-for="(item,index) in defDetail">
                  <template>
                    <a-col :span="4">
                      <a-checkbox :value="item.dataIndex">
                        <j-ellipsis :value="item.title" :length="6"></j-ellipsis>
                      </a-checkbox>
                    </a-col>
                  </template>
                </template>
              </a-row>
            </a-checkbox-group>
            <a-divider orientation="left" style="width: 720px">2、自定义明细列</a-divider>
            <a-checkbox-group @change="onColSettingsChange" v-model="settingColumns" :defaultValue="settingColumns">
              <a-row style="width: 720px">
                <template v-for="(item,index) in defColumns">
                  <template>
                    <a-col :span="4">
                      <a-checkbox :value="item.dataIndex">
                        <j-ellipsis :value="item.title" :length="6"></j-ellipsis>
                      </a-checkbox>
                    </a-col>
                  </template>
                </template>
              </a-row>
            </a-checkbox-group>
            <a-divider orientation="left" style="width: 720px">3、自定义明细行数</a-divider>
            <a-row class="form-row" :gutter="24">
              <a-col :span="12">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="第一页行数">
                  <a-input placeholder="第一页行数" @change="onChangeFirstSize" :defaultValue="firstSize"/>
                </a-form-item>
              </a-col>
              <a-col :span="12">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="后续页行数">
                  <a-input placeholder="后续页行数" @change="onChangeSecondSize" :defaultValue="secondSize"/>
                </a-form-item>
              </a-col>
            </a-row>
            <a-divider orientation="left" style="width: 720px">4、自定义单据标题</a-divider>
            <a-row class="form-row" :gutter="24">
              <a-col :span="12">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据标题">
                  <a-input placeholder="请输入单据标题" @change="onChangeBillTitle" :defaultValue="billTypeStr"/>
                </a-form-item>
              </a-col>
              <a-col :span="12"></a-col>
            </a-row>
            <a-divider orientation="left" style="width: 720px">5、自定义审核栏</a-divider>
            <a-row class="form-row" :gutter="24">
              <a-col :span="12">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="审核栏">
                  <a-input placeholder="请输入审核栏（用#分隔可换行）" @change="onChangeAuditSetting" :defaultValue="auditSettingStr"/>
                </a-form-item>
              </a-col>
              <a-col :span="12"></a-col>
            </a-row>
            <a-divider orientation="left" style="width: 720px">6、公司信息和销售协议请到【系统配置】中填写</a-divider>
          </template>
          <a-button style="margin-right: 8px" icon="setting">模板设置</a-button>
        </a-popover>
        <!--打印按钮-->
        <a-button v-if="billType === '零售出库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '零售退货入库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '请购单'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '采购订单'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '采购入库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '采购退货出库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '销售订单'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '销售出库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '销售退货入库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '其它入库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '其它出库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '调拨出库'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '组装单'" @click="printBill()" icon="printer">打印</a-button>
        <a-button v-if="billType === '拆卸单'" @click="printBill()" icon="printer">打印</a-button>
        <!--抬头-->
        <template>
          <div :style="tableWidth" style="text-align:center;color:black">
            <a-row class="form-row" :gutter="24">
              <a-col :lg="24" :md="24" :sm="24">
                <span style="font-size: 20px;">
                  {{billTitle}}
                </span>
              </a-col>
              <a-col :lg="24" :md="24" :sm="24" style="padding:5px;">
                <span style="font-size: 14px;">
                  {{company.contacts}} {{company.address}} {{company.tel}} {{company.fax}}
                </span>
              </a-col>
            </a-row>
          </div>
        </template>
        <!--零售出库-->
        <template v-if="billType === '零售出库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                会员卡号：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                手机号码：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('payType')>-1">
                收款类型：{{model.payType}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                单据金额：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('getAmount')>-1">
                收款金额：{{model.getAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('backAmount')>-1">
                找零：{{model.backAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                收款账户：{{model.accountName}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--零售退货-->
        <template v-else-if="billType === '零售退货入库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                会员卡号：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                手机号码：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联单据：{{model.linkNumber}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                单据金额：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('getAmount')>-1">
                付款金额：{{model.getAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('backAmount')>-1">
                找零：{{model.backAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                付款账户：{{model.accountName}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--请购单-->
        <template v-else-if="billType === '请购单'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--采购订单-->
        <template v-else-if="billType === '采购订单'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                供应商：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                供应商姓名：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                供应商手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                供应商地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                付款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                支付订金：{{model.changeAmount}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--采购入库-->
        <template v-else-if="billType === '采购入库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                供应商：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                供应商姓名：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                供应商手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                供应商地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联订单：{{model.linkNumber?model.linkNumber:'无'}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                付款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('otherMoney')>-1">
                其它费用：{{model.otherMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('deposit')>-1">
                扣除订金：{{model.deposit}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                本次付款：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('debt')>-1">
                本次欠款：{{model.debt}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('allNeed')>-1">
                累计欠款：{{allNeed}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--采购退货-->
        <template v-else-if="billType === '采购退货出库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                供应商：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                供应商姓名：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                供应商手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                供应商地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联单据：{{model.linkNumber}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                退款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('otherMoney')>-1">
                其它费用：{{model.otherMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                本次退款：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('debt')>-1">
                本次欠款：{{model.debt}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--销售订单-->
        <template v-else-if="billType === '销售订单'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                客户：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                客户联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                客户手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                客户地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                收款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                收取订金：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('salesManStr')>-1 && model.salesManStr && model.salesManStr!=''">
                销售人员：{{model.salesManStr}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--销售出库-->
        <template v-else-if="billType === '销售出库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                客户：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                客户联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                客户手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                客户地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联订单：{{model.linkNumber?model.linkNumber:'无'}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                收款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('otherMoney')>-1">
                其它费用：{{model.otherMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('deposit')>-1">
                扣除订金：{{model.deposit}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                本次收款：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('debt')>-1">
                本次欠款：{{model.debt}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('allNeed')>-1">
                累计欠款：{{allNeed}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('salesManStr')>-1 && model.salesManStr && model.salesManStr!=''">
                销售人员：{{model.salesManStr}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--销售退货-->
        <template v-else-if="billType === '销售退货入库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                客户：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                客户联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                客户手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                客户地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联单据：{{model.linkNumber}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discount')>-1">
                优惠率：{{model.discount}}%
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountMoney')>-1">
                退款优惠：{{model.discountMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('discountLastMoney')>-1">
                优惠后金额：{{model.discountLastMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('otherMoney')>-1">
                其它费用：{{model.otherMoney}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('accountName')>-1">
                结算账户：{{model.accountName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('changeAmount')>-1">
                本次退款：{{model.changeAmount}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('debt')>-1">
                本次欠款：{{model.debt}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('salesManStr')>-1 && model.salesManStr && model.salesManStr!=''">
                销售人员：{{model.salesManStr}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--其它入库-->
        <template v-else-if="billType === '其它入库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                供应商：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                供应商姓名：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                供应商手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                供应商地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联单据：{{model.linkNumber}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--其它出库-->
        <template v-else-if="billType === '其它出库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('organName')>-1">
                客户：{{model.organName}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('contacts')>-1 && model.contacts && model.contacts!=''">
                客户联系人：{{model.contacts}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('telephone')>-1 && model.telephone && model.telephone!=''">
                客户手机：{{model.telephone}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('address')>-1 && model.address && model.address!=''">
                客户地址：{{model.address}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('linkNumber')>-1">
                关联单据：{{model.linkNumber}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--调拨出库-->
        <template v-else-if="billType === '调拨出库'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--组装单-->
        <template v-else-if="billType === '组装单'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <!--拆卸单-->
        <template v-else-if="billType === '拆卸单'">
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('operTimeStr')>-1">
                单据日期：{{model.operTimeStr}}
              </a-col>
              <a-col :span="12" v-if="detail.indexOf('number')>-1">
                单据编号：{{model.number}}
              </a-col>
              <a-col :span="24" v-if="detail.indexOf('remark')>-1">
                备注：{{model.remark}}
              </a-col>
            </a-row>
          </div>
        </template>
        <template>
          <div :style="tableWidth" v-for="(item,i) in dsList" style="margin-top:5px">
            <a-table
              ref="table"
              bordered
              size="small"
              rowKey="id"
              :showHeader="false"
              :pagination="false"
              :columns="columns"
              :dataSource="item">
            </a-table>
            <div v-if="i<dsList.length-1" style="height: 36px;border-bottom:dashed 1px #e8e8e8"></div>
            <div v-if="i<dsList.length-1" style="height: 36px;"></div>
          </div>
          <div :style="tableWidth" class="bill-item">
            <a-row class="form-row" :gutter="24">
              <a-col :span="12" v-if="detail.indexOf('totalAmount')>-1">合计：{{billDetailCnMoney}}（￥{{billDetailAllPrice}}）</a-col>
              <a-col :span="6" v-if="detail.indexOf('creator')>-1">制单人：{{creatorName}}</a-col>
              <a-col :span="6" v-if="billType === '销售出库' && detail.indexOf('consigneeSign')>-1">收货人签字：</a-col>
            </a-row>
            <a-row class="form-row" :gutter="24" style="margin-top:5px;font-size:13px;">
              <a-col :span="24">
                <p v-html="auditSettingWithLineBreak"></p>
              </a-col>
            </a-row>
            <a-row class="form-row" :gutter="24" style="margin-top:5px;" v-if="billType === '销售出库'">
              <a-col :span="24">
                <span style="font-size:13px;">
                  {{company.saleAgreement}}
                </span>
              </a-col>
            </a-row>
          </div>
        </template>
      </a-form>
    </a-card>
  </a-config-provider>
</template>

<script>
  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
  import pick from 'lodash.pick'
  import { updateTheme } from '@/components/tools/setting'
  import { DEFAULT_COLOR } from "@/store/mutation-types"
  import { getAction } from '@/api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { findBillDetailByNumber, getCurrentSystemConfig, getBillPrint, saveBillPrint, getAllNeedByParam} from '@/api/api'
  import { getMpListShort, getUrlParam, addHeadToArr } from "@/utils/util"
  import JEllipsis from '@/components/jeecg/JEllipsis'
  import Vue from 'vue'
  export default {
    name: 'BillPrint',
    mixins:[JeecgListMixin],
    components: {
      JEllipsis
    },
    data () {
      return {
        locale: zhCN,
        title: "三联打印预览",
        width: '1000px',
        visible: false,
        model: {},
        billType: '',
        billTypeStr: '',
        billTitle: '',
        auditSettingStr: '',
        fileList: [],
        company: {},
        firstSize: 5,
        secondSize: 10,
        tableWidth: {
          'width': '730px'
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 18 },
        },
        form: this.$form.createForm(this),
        disableMixinCreated: true,
        loading: false,
        dataSource: [],
        dsList:[],
        url: {
          detailList: '/depotItem/getDetailList'
        },
        //单据详细信息
        detail: [],
        //单据详细信息设置
        settingDetail:[],
        //单据详细信息
        defDetail: [],
        //单据明细金额合计-大写
        billDetailCnMoney: 0,
        //单据明细金额合计
        billDetailAllPrice: 0,
        //累计欠款
        allNeed: 0,
        creatorName: '',
        retailOutDetail: [
          { title: '会员卡号', dataIndex: 'organName'},
          { title: '联系人', dataIndex: 'contacts'},
          { title: '手机号码', dataIndex: 'telephone'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '收款类型', dataIndex: 'payType'},
          { title: '单据金额', dataIndex: 'changeAmount'},
          { title: '收款金额', dataIndex: 'getAmount'},
          { title: '找零', dataIndex: 'backAmount'},
          { title: '收款账户', dataIndex: 'accountName'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        retailBackDetail: [
          { title: '会员卡号', dataIndex: 'organName'},
          { title: '联系人', dataIndex: 'contacts'},
          { title: '手机号码', dataIndex: 'telephone'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联单据', dataIndex: 'linkNumber'},
          { title: '单据金额', dataIndex: 'changeAmount'},
          { title: '付款金额', dataIndex: 'getAmount'},
          { title: '找零', dataIndex: 'backAmount'},
          { title: '付款账户', dataIndex: 'accountName'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        purchaseApplyDetail: [
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '备注', dataIndex: 'remark'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        purchaseOrderDetail: [
          { title: '供应商', dataIndex: 'organName'},
          { title: '供应商姓名', dataIndex: 'contacts'},
          { title: '供应商手机', dataIndex: 'telephone'},
          { title: '供应商地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '付款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '支付订金', dataIndex: 'changeAmount'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        purchaseInDetail: [
          { title: '供应商', dataIndex: 'organName'},
          { title: '供应商姓名', dataIndex: 'contacts'},
          { title: '供应商手机', dataIndex: 'telephone'},
          { title: '供应商地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联订单', dataIndex: 'linkNumber'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '付款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '其它费用', dataIndex: 'otherMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '扣除订金', dataIndex: 'deposit'},
          { title: '本次付款', dataIndex: 'changeAmount'},
          { title: '本次欠款', dataIndex: 'debt'},
          { title: '累计欠款', dataIndex: 'allNeed'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        purchaseBackDetail: [
          { title: '供应商', dataIndex: 'organName'},
          { title: '供应商姓名', dataIndex: 'contacts'},
          { title: '供应商手机', dataIndex: 'telephone'},
          { title: '供应商地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联单据', dataIndex: 'linkNumber'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '退款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '其它费用', dataIndex: 'otherMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '本次退款', dataIndex: 'changeAmount'},
          { title: '本次欠款', dataIndex: 'debt'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        saleOrderDetail: [
          { title: '客户', dataIndex: 'organName'},
          { title: '客户联系人', dataIndex: 'contacts'},
          { title: '客户手机', dataIndex: 'telephone'},
          { title: '客户地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '收款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '收取订金', dataIndex: 'changeAmount'},
          { title: '销售人员', dataIndex: 'salesManStr'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        saleOutDetail: [
          { title: '客户', dataIndex: 'organName'},
          { title: '客户联系人', dataIndex: 'contacts'},
          { title: '客户手机', dataIndex: 'telephone'},
          { title: '客户地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联订单', dataIndex: 'linkNumber'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '收款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '其它费用', dataIndex: 'otherMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '扣除订金', dataIndex: 'deposit'},
          { title: '本次收款', dataIndex: 'changeAmount'},
          { title: '本次欠款', dataIndex: 'debt'},
          { title: '累计欠款', dataIndex: 'allNeed'},
          { title: '销售人员', dataIndex: 'salesManStr'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'},
          { title: '收货人签字', dataIndex: 'consigneeSign'}
        ],
        saleBackDetail: [
          { title: '客户', dataIndex: 'organName'},
          { title: '客户联系人', dataIndex: 'contacts'},
          { title: '客户手机', dataIndex: 'telephone'},
          { title: '客户地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联单据', dataIndex: 'linkNumber'},
          { title: '优惠率', dataIndex: 'discount'},
          { title: '退款优惠', dataIndex: 'discountMoney'},
          { title: '优惠后金额', dataIndex: 'discountLastMoney'},
          { title: '其它费用', dataIndex: 'otherMoney'},
          { title: '结算账户', dataIndex: 'accountName'},
          { title: '本次退款', dataIndex: 'changeAmount'},
          { title: '本次欠款', dataIndex: 'debt'},
          { title: '销售人员', dataIndex: 'salesManStr'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        otherInDetail: [
          { title: '供应商', dataIndex: 'organName'},
          { title: '供应商姓名', dataIndex: 'contacts'},
          { title: '供应商手机', dataIndex: 'telephone'},
          { title: '供应商地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联单据', dataIndex: 'linkNumber'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        otherOutDetail: [
          { title: '客户', dataIndex: 'organName'},
          { title: '客户联系人', dataIndex: 'contacts'},
          { title: '客户手机', dataIndex: 'telephone'},
          { title: '客户地址', dataIndex: 'address'},
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '关联单据', dataIndex: 'linkNumber'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        allocationOutDetail: [
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        assembleDetail: [
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        disassembleDetail: [
          { title: '单据日期', dataIndex: 'operTimeStr'},
          { title: '单据编号', dataIndex: 'number'},
          { title: '备注', dataIndex: 'remark'},
          { title: '合计', dataIndex: 'totalAmount'},
          { title: '制单人', dataIndex: 'creator'}
        ],
        //表头
        columns:[],
        //列设置
        settingColumns:[],
        //列定义
        defColumns: [],
        retailOutColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        retailBackColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        purchaseApplyColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '备注', dataIndex: 'remark'}
        ],
        purchaseOrderColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '备注', dataIndex: 'remark'}
        ],
        purchaseInColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        purchaseBackColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        saleOrderColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '备注', dataIndex: 'remark'}
        ],
        saleOutColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        saleBackColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '税率(%)', dataIndex: 'taxRate'},
          { title: '税额', dataIndex: 'taxMoney'},
          { title: '价税合计', dataIndex: 'taxLastMoney'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        otherInColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        otherOutColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '序列号', dataIndex: 'snList', width:300},
          { title: '批号', dataIndex: 'batchNumber'},
          { title: '有效期', dataIndex: 'expirationDate'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        allocationOutColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '调入仓库', dataIndex: 'anotherDepotName'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '重量', dataIndex: 'weight'},
          { title: '仓位货架', dataIndex: 'position'},
          { title: '备注', dataIndex: 'remark'}
        ],
        assembleColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '商品类型', dataIndex: 'mType'},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '备注', dataIndex: 'remark'}
        ],
        disassembleColumns: [
          { title: '序号', dataIndex: 'rowIndex', width:40, align:"center"},
          { title: '商品类型', dataIndex: 'mType'},
          { title: '仓库名称', dataIndex: 'depotName'},
          { title: '条码', dataIndex: 'barCode'},
          { title: '名称', dataIndex: 'name'},
          { title: '规格', dataIndex: 'standard'},
          { title: '型号', dataIndex: 'model'},
          { title: '颜色', dataIndex: 'color'},
          { title: '品牌', dataIndex: 'brand'},
          { title: '制造商', dataIndex: 'mfrs'},
          { title: '扩展信息', dataIndex: 'materialOther'},
          { title: '库存', dataIndex: 'stock'},
          { title: '单位', dataIndex: 'unit'},
          { title: '多属性', dataIndex: 'sku'},
          { title: '数量', dataIndex: 'operNumber'},
          { title: '单价', dataIndex: 'unitPrice'},
          { title: '金额', dataIndex: 'allPrice'},
          { title: '备注', dataIndex: 'remark'}
        ]
      }
    },
    created () {
      this.initDetail()
    },
    mounted () {
      this.primaryColor = Vue.ls.get(DEFAULT_COLOR)
      updateTheme(this.primaryColor)
    },
    computed: {
      auditSettingWithLineBreak() {
        return this.auditSettingStr?this.auditSettingStr.replaceAll('#', '<br>'):''
      }
    },
    methods: {
      initDetail() {
        let no = getUrlParam('no')
        findBillDetailByNumber({ number: no }).then((res) => {
          if (res && res.code === 200) {
            let type = res.data.type === "其它"? "":res.data.type
            this.show(res.data, res.data.subType + type);
            this.title = res.data.subType + type + "-详情";
            if(this.billType === '零售出库' || this.billType === '零售退货入库' || this.billType === '采购订单' || this.billType === '销售订单' ||
              this.billType === '其它入库' || this.billType === '其它出库' || this.billType === '调拨出库' || this.billType === '组装单' || this.billType === '拆卸单') {
              this.billDetailAllPrice = res.data.totalPrice
            } else {
              this.billDetailAllPrice = res.data.discountLastMoney + res.data.discountMoney
            }
            this.billDetailCnMoney = this.toCnMoney(this.billDetailAllPrice)
            this.creatorName = res.data.creatorName
            //查询供应商或客户的累计欠款
            if(res.data.subType === '采购' || res.data.subType === '销售') {
              getAllNeedByParam({ organId: res.data.organId, type: res.data.type, subType: res.data.subType }).then((res) => {
                if (res && res.code === 200) {
                  this.allNeed = res.data
                }
              })
            }
          }
        })
      },
      show(record, type) {
        this.billType = type
        this.billTypeStr = this.billType.replace('退货出库','退货')
          .replace('退货入库','退货').replace('单','') + '单'
        //附件下载
        this.fileList = record.fileName
        this.visible = true;
        this.model = Object.assign({}, record);
        if(this.model.backAmount) {
          this.model.getAmount = (this.model.changeAmount + this.model.backAmount).toFixed(2)
        } else {
          this.model.getAmount = this.model.changeAmount
        }
        this.model.debt = (this.model.discountLastMoney + this.model.otherMoney - (this.model.deposit + this.model.changeAmount)).toFixed(2)
        let params = {
          headerId: this.model.id,
          mpList: getMpListShort(Vue.ls.get('materialPropertyList')),  //扩展属性
          linkType: 'basic',
          isReadOnly: '1'
        }
        let url = this.readOnly ? this.url.detailList : this.url.detailList;
        this.initCompanyInfo()
        this.initSetting()
        this.initDetailSetting()
        this.initColumnsSetting()
        this.requestSubTableData(url, params);
      },
      requestSubTableData(url, params, success) {
        this.loading = true
        getAction(url, params).then(res => {
          if(res && res.code === 200){
            this.dataSource = res.data.rows
            for (let i = 0; i < this.dataSource.length-1; i++) {
              this.dataSource[i].rowIndex = i+1
            }
            this.initTablePageSize()
            typeof success === 'function' ? success(res) : ''
          }
        }).finally(() => {
          this.loading = false
        })
      },
      //加载公司信息
      initCompanyInfo() {
        getBillPrint({ billType: this.billType }).then((res) => {
          if (res && res.code === 200) {
            if(res.data) {
              if(res.data.billTitle) {
                this.billTypeStr = res.data.billTitle
              }
              this.auditSettingStr = res.data.auditSetting
            }
            this.billTitle = this.billTypeStr
            getCurrentSystemConfig().then((res) => {
              if(res.code === 200 && res.data){
                this.company.name = res.data.companyName
                this.company.contacts = res.data.companyContacts
                this.company.address = res.data.companyAddress
                this.company.tel = res.data.companyTel
                this.company.fax = res.data.companyFax
                this.company.saleAgreement = res.data.saleAgreement
                if(this.company.name) {
                  this.billTitle = this.company.name + '-' + this.billTypeStr
                } else {
                  this.billTitle = this.billTypeStr
                }
              }
            })
          }
        })
      },
      //初始化
      initSetting() {
        if(this.billType === '零售出库') {
          this.defDetail = this.retailOutDetail
          this.defColumns = this.retailOutColumns
        } else if(this.billType === '零售退货入库') {
          this.defDetail = this.retailBackDetail
          this.defColumns = this.retailBackColumns
        } else if(this.billType === '请购单') {
          this.defDetail = this.purchaseApplyDetail
          this.defColumns = this.purchaseApplyColumns
        } else if(this.billType === '采购订单') {
          this.defDetail = this.purchaseOrderDetail
          this.defColumns = this.purchaseOrderColumns
        } else if(this.billType === '采购入库') {
          this.defDetail = this.purchaseInDetail
          this.defColumns = this.purchaseInColumns
        } else if(this.billType === '采购退货出库') {
          this.defDetail = this.purchaseBackDetail
          this.defColumns = this.purchaseBackColumns
        } else if(this.billType === '销售订单') {
          this.defDetail = this.saleOrderDetail
          this.defColumns = this.saleOrderColumns
        } else if(this.billType === '销售出库') {
          this.defDetail = this.saleOutDetail
          this.defColumns = this.saleOutColumns
        } else if(this.billType === '销售退货入库') {
          this.defDetail = this.saleBackDetail
          this.defColumns = this.saleBackColumns
        } else if(this.billType === '其它入库') {
          this.defDetail = this.otherInDetail
          this.defColumns = this.otherInColumns
        } else if(this.billType === '其它出库') {
          this.defDetail = this.otherOutDetail
          this.defColumns = this.otherOutColumns
        } else if(this.billType === '调拨出库') {
          this.defDetail = this.allocationOutDetail
          this.defColumns = this.allocationOutColumns
        } else if(this.billType === '组装单') {
          this.defDetail = this.assembleDetail
          this.defColumns = this.assembleColumns
        } else if(this.billType === '拆卸单') {
          this.defDetail = this.disassembleDetail
          this.defColumns = this.disassembleColumns
        }
      },
      //初始化单据详细
      initDetailSetting() {
        getBillPrint({ billType: this.billType }).then((res) => {
          if (res && res.code === 200) {
            if(res.data && res.data.detailSetting){
              this.settingDetail = res.data.detailSetting.split(',');
              this.detail = res.data.detailSetting.split(',');
            } else {
              let allSettingDetail = [];
              this.defDetail.forEach(function (item,i,array ) {
                allSettingDetail.push(item.dataIndex);
              })
              this.settingDetail = allSettingDetail;
              this.detail = allSettingDetail;
            }
          } else {
            this.$message.warning(res.data)
          }
        })
      },
      //单据详细设置更改事件
      onDetailSettingsChange (checkedValues) {
        this.settingDetail = checkedValues;
        this.detail = checkedValues;
        let param = { billType: this.billType, detailSetting: checkedValues.join() }
        saveBillPrint(param).then((res) => {})
      },
      //初始化列
      initColumnsSetting(){
        getBillPrint({ billType: this.billType }).then((res) => {
          if (res && res.code === 200) {
            if(res.data && res.data.columnSetting){
              this.settingColumns = res.data.columnSetting.split(',');
              const cols = this.defColumns.filter(item => {
                if (this.settingColumns.includes(item.dataIndex)) {
                  return true;
                }
                return false;
              })
              this.columns =  cols;
            } else {
              let allSettingColumns = [];
              this.defColumns.forEach(function (item,i,array ) {
                allSettingColumns.push(item.dataIndex);
              })
              this.settingColumns = allSettingColumns;
              this.columns = this.defColumns;
            }
          } else {
            this.$message.warning(res.data)
          }
        })
      },
      //列设置更改事件
      onColSettingsChange (checkedValues) {
        this.settingColumns = checkedValues;
        const cols = this.defColumns.filter(item => {
          if (this.settingColumns.includes(item.dataIndex)) {
            return true
          }
          return false
        })
        this.columns = cols;
        let param = { billType: this.billType, columnSetting: checkedValues.join() }
        saveBillPrint(param).then((res) => {})
      },
      //初始化页数
      initTablePageSize() {
        getBillPrint({ billType: this.billType }).then((res) => {
          if (res && res.code === 200) {
            if(res.data && res.data.firstSize){
              this.firstSize = res.data.firstSize
            }
            if(res.data && res.data.secondSize){
              this.secondSize = res.data.secondSize
            }
            if(this.firstSize < this.dataSource.length) {
              let ds1 = this.dataSource.slice(0, this.firstSize);
              //第1页-先构造标题
              ds1 = addHeadToArr(this.defColumns, ds1)
              this.dsList.push(ds1)
              for(let i=0; i<(this.dataSource.length-this.firstSize)/this.secondSize; i++) {
                let ds2 = this.dataSource.slice(this.firstSize + this.secondSize*i, this.firstSize + this.secondSize*(i+1));
                //第2页及后续页-先构造标题
                ds2 = addHeadToArr(this.defColumns, ds2)
                this.dsList.push(ds2)
              }
            } else {
              //先构造标题
              let ds1 = this.dataSource
              ds1 = addHeadToArr(this.defColumns, ds1)
              this.dsList.push(ds1)
            }
          } else {
            this.$message.warning(res.data)
          }
        })
      },
      onChangeFirstSize(event) {
        if(event && event.target.value) {
          this.firstSize = event.target.value-0
          if(this.firstSize && this.secondSize) {
            let param = { billType: this.billType, firstSize: this.firstSize, secondSize: this.secondSize }
            saveBillPrint(param).then((res) => {
              if (res && res.code === 200) {
                this.changeSize()
              }
            })
          }
        }
      },
      onChangeSecondSize(event) {
        if(event && event.target.value) {
          this.secondSize = event.target.value - 0
          if(this.firstSize && this.secondSize) {
            let param = { billType: this.billType, firstSize: this.firstSize, secondSize: this.secondSize }
            saveBillPrint(param).then((res) => {
              if (res && res.code === 200) {
                this.changeSize()
              }
            })
          }
        }
      },
      changeSize() {
        this.dsList = []
        console.log('firstSize:' + this.firstSize)
        console.log('secondSize:' + this.secondSize)
        if(this.firstSize < this.dataSource.length) {
          let ds1 = this.dataSource.slice(0, this.firstSize)
          //第1页-先构造标题
          ds1 = addHeadToArr(this.defColumns, ds1)
          this.dsList.push(ds1)
          for(let i=0; i<(this.dataSource.length-this.firstSize)/this.secondSize; i++) {
            let start = this.firstSize + this.secondSize*i
            let end = this.firstSize + this.secondSize*(i+1)
            console.log('start:' + start)
            console.log('end:' + end)
            let ds2 = this.dataSource.slice(start, end)
            //第2页及后续页-先构造标题
            ds2 = addHeadToArr(this.defColumns, ds2)
            this.dsList.push(ds2)
          }
        } else {
          //先构造标题
          let ds1 = this.dataSource
          ds1 = addHeadToArr(this.defColumns, ds1)
          this.dsList.push(ds1)
        }
      },
      onChangeBillTitle(event) {
        if(event && event.target.value) {
          let billTitle = event.target.value
          let param = { billType: this.billType, billTitle: billTitle }
          saveBillPrint(param).then((res) => {
            if (res && res.code === 200) {
              this.initCompanyInfo()
            }
          })
        }
      },
      onChangeAuditSetting(event) {
        if(event) {
          let auditSetting = event.target.value
          let param = { billType: this.billType, auditSetting: auditSetting }
          saveBillPrint(param).then((res) => {
            if (res && res.code === 200) {
              this.initCompanyInfo()
            }
          })
        }
      },
      //金额数字转为大写
      toCnMoney(num) {
        let strOutput = "";
        let strUnit = '仟佰拾亿仟佰拾万仟佰拾元角分';
        num += "00";
        let intPos = num.indexOf('.');
        if (intPos >= 0) {
          num = num.substring(0, intPos) + num.substr(intPos + 1, 2);
        }
        strUnit = strUnit.substr(strUnit.length - num.length);
        for (let i = 0; i < num.length; i++) {
          strOutput += '零壹贰叁肆伍陆柒捌玖'.substr(num.substr(i, 1), 1) + strUnit.substr(i, 1);
        }
        return strOutput.replace(/零角零分$/, '整').replace(/零[仟佰拾]/g, '零')
          .replace(/零{2,}/g, '零').replace(/零([亿|万])/g, '$1')
          .replace(/零+元/, '元').replace(/亿零{0,3}万/, '亿')
          .replace(/^元/, "零元");
      },
      printBill() {
        window.print()
      },
      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close');
        this.visible = false;
      }
    }
  }
</script>

<style scoped>
  @media print {
    button {
      display: none
    }
  }
  @page {
    margin: 0mm;
  }
</style>
<style>
  .ant-card-body .ant-form-item{
    margin-bottom: 0px;
    font-size: 14px;
    color: black;
  }
  .ant-form-item label{
    font-size: 14px !important;
    color: black;
  }
  .ant-table-small{
    border:0 !important;
  }
  .ant-table-small.ant-table-bordered .ant-table-content{
    border-right:0 !important;
  }
  .ant-table-small > .ant-table-content > .ant-table-body{
    margin: 0 !important;
  }
  .ant-table-thead th{
    border-top: 1px solid black !important;
    border-right: 1px solid black !important;
    border-bottom: 1px solid black !important;
  }
  .ant-table-thead th:first-child{
    border-left: 1px solid black !important;
  }
  .ant-table-thead th:last-child{
    border-right: 1px solid black !important;
  }
  .ant-table-thead > tr:first-child > th:first-child{
    border-top-left-radius: 0 !important;
  }
  .ant-table-thead > tr:first-child > th:last-child{
    border-top-right-radius: 0 !important;
  }
  .ant-table .ant-table-column-title{
    font-size: 15px;
    color: black;
  }
  .ant-table .ant-table-tbody{
    font-size: 14px;
    color: black;
  }
  .ant-table-small > .ant-table-content > .ant-table-body > table > .ant-table-thead > tr > th{
    padding: 2px 2px !important;
  }
  .ant-table-small > .ant-table-content > .ant-table-body > table > .ant-table-tbody > tr > td{
    padding: 2px 2px !important;
  }

  .ant-table .ant-table-tbody > tr:first-child > td{
    border-top: 1px solid black !important;
  }

  .ant-table .ant-table-tbody > tr > td{
    border-left: 0 !important;
    border-right: 1px solid black !important;
    border-bottom: 1px solid black !important;
  }

  .ant-table .ant-table-tbody > tr > td:first-child{
    border-left: 1px solid black !important;
  }
  .ant-table .ant-table-tbody > tr > td:last-child{
    border-right: 1px solid black !important;
  }
  .bill-item {
    margin-top:5px;
    color:black;
    font-size:14px;
  }
</style>